<template>
	<view class="content">
		<view class="top_nav">
			<view class="kong"></view>
			<!-- <image src="../../static/buy/1.png"></image> -->
			<view class="tab_item">
				<view class="return" @click="returnPage">
					<image src="https://jialianxin-1301053941.cos.ap-chengdu.myqcloud.com/static/course/jiantou.png">
					</image>
				</view>
				<view class="title">分享海报</view>
				<view class="return"></view>
			</view>
			<movable-area class="t1">
				<movable-view out-of-bounds="true" class="imgbox" :style="imgboxStyle" direction="horizontal">
					<template v-for="(item, index) in imgs">
						<image @click="select(item)" mode="heightFix" :key="index"
							style="height:230rpx;margin-left:50rpx;" :src="item.url" lazy-load="true"></image>
					</template>
				</movable-view>
			</movable-area>
		</view>

		<view class="mainbox">
			<view class="box">
				<image class="curimg" mode="heightFix" :src="curimg" lazy-load="true"></image>
					<!-- <button @click="fenxiang" class="but">分享得好礼</button> -->
					<button open-type='share' class='but' hover-class='none'>分享得好礼</button>
					<!-- <button class='but' hover-class='none' @click="tozhuli()">点击助力</button> -->
			</view>
		</view>
	</view>
</template>

<script>
	// 引入方法
	import appShare, {
		closeShare
	} from "@/js_sdk/zhouWei-APPshare/plugins/share/index.js"
	import { setPointApi} from '@/api/results.js';
	export default {
		data() {
			return {
				member_id: '',
				model: 1,
				curimg: 'https://wanxian-test.oss-cn-shenzhen.aliyuncs.com/6623.png',
				imgs: [{
						url: 'https://wanxian-test.oss-cn-shenzhen.aliyuncs.com/6623.png'
					},
					{
						url: 'https://wanxian-test.oss-cn-shenzhen.aliyuncs.com/6623.png'
					},
					{
						url: 'https://wanxian-test.oss-cn-shenzhen.aliyuncs.com/6623.png'
					}
				],
				shareObj: null,
				imgboxStyle: {
					"width": "400vw"
				},
				gzhImg: ''
			}
		},
		
		onLoad() {

		},
		onBackPress() {
			uni.navigateTo({
				url:'/pages/main/pointWheel'
			})
			return true;
		},
		methods: {
			onShareAppMessage: function (res) {
				  this.member_id = uni.getStorageSync("member_id");
				  // console.log(666,this.member_id)
				  this.$forceUpdate();
			//转发事件来源:button：页面内转发按钮；menu：右上角转发菜单
			    if (res.from === 'button') {
			      console.log("来自页面内转发按钮");
			      console.log(res.target);
			    }
			    else {
			      console.log("来自右上角转发菜单")
			    }
				this.setPoint();
			    return {
			      title: '好友邀请一起来拿588元红包',
			      imageUrl: this.curimg,//转发携带的图片,可以是本地文件路径、代码包文件路径或者网络图片路径。支持PNG及JPG
			      path: '/activePages/pages/share_call/share_call?member_id='+ this.member_id,//当前页面 path ，必须是以 / 开头的完整路径
			      success: (res) => {
			        // alert("监听到了")
			      },
			      fail: (res) => {
			        // console.log("转发失败", res);
			      }
			    }
			  },
			async setPoint(){
				let params = {}
				const res = await setPointApi(params);
			},
			tozhuli() {
				uni.navigateTo({
					url: '../assistance/assistance'
				})
			},
			returnPage() {
			uni.redirectTo({
				url:'/pages/main/pointWheel'
			})
			},
			select(item) {
				this.model = item.index;
				this.curimg = item.url;
			},
			fenxImg(imgurl) {
				console.log("分享图片地址", imgurl);
				let shareData = {
					shareUrl: "http://jialianxin.cn/",
					shareTitle: "分享的标题",
					shareContent: "分享的描述",
					shareImg: imgurl,
					appWebUrl: "http://jialianxin.cn/",
					type: 2
				};
				// 调用
				this.shareObj = appShare(shareData, res => {
					console.log("分享成功回调", res);
					// 分享成功后关闭弹窗
					// 第一种关闭弹窗的方式
					// closeShare();
				});
				setTimeout(() => {
					// 第二种关闭弹窗的方式
					this.shareObj.close();
				}, 8000);

			},




			fenxiang() {

				// if (this.model == "null") {
				this.fenxImg(this.curimg);
				// return;
				// }
				// let userInfo = uni.getStorageSync("userInfo");
				// let user_id = userInfo.user_id;
				// this.Unfold_data.upload_data({
				// 	user: user_id
				// }, 'POST', "/api/member/member/member", res => {
				// 	if (res.statusCode == 200 && res.data.code == 1) {
				// 		let shop_id = (res.data.data.length > 0) ? res.data.data[0].shop_id : null;
				// 		this.Unfold_data.tea_data({
				// 			model: this.model,
				// 			user_id: user_id,
				// 			shop_id: this.Config_ysy.SaaS,
				// 			index: this.model,
				// 			token: userInfo.token
				// 		}, 'POST', "/api/channel/M3/getHaibao", res => {
				// 			if (res.statusCode == 200 && res.data.code == 1) {
				// 				this.fenxImg(res.data.data.img);
				// 			} else {
				// 				this.Unfold_data.showWindow(res.data.msg);
				// 			}
				// 		});
				// 	}
				// })
			},


			gzhShare() {
				uni.share({
					provider: "weixin",
					scene: "WXSenceTimeline",
					type: 2,
					imageUrl: "http://jialianxin.cn/" + this.gzhImg,
					success: function(res) {
						console.log("success:" + JSON.stringify(res));
					},
					fail: function(err) {
						console.log("fail:" + JSON.stringify(err));
					}
				});
			},

			playShare() {
				switch (uni.getSystemInfoSync().platform) {

					case 'android':
						this.fenxiang()
						console.log('运行Android上')

						break;

					case 'ios':
						this.fenxiang()
						console.log('运行iOS上')

						break;

					default:
						this.gzhShare()
						console.log('运行在开发者工具上')

						break;

				}

			}
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		width: 100vw;
		position: relative;

		.top_nav {
			width: 100vw;
			height: 560upx;
			background-image: url('https://jialianxin-1301053941.cos.ap-chengdu.myqcloud.com/new_saas/zwnl/8.png');
			background-size: 750upx 400upx;
			position: fixed;
			top: 0;
			left: 0;
			z-index: 10;

			.kong {
				width: 100vw;
				height: 60upx;
			}

			.tab_item {
				width: 90vw;
				margin: 0 auto;
				height: 100upx;
				display: flex;
				align-items: center;
				justify-content: center;

				.return {
					flex: 1;
					width: 100vw;

					image {
						width: 29upx;
						height: 29upx;
					}
				}

				.title {
					flex: 8;
					width: 100vw;
					color: #ffffff;
					display: flex;
					align-items: center;
					justify-content: center;
					z-index: 10;
				}
			}

			.t1 {
				width: 100vw;
				margin-top: 10rpx;
				height: 330rpx;

				.imgbox {
					width: 365vw;
					height: 100vh;
				}
			}
		}

		.mainbox {
			width: 100vw;
			height: 100vh;
			background-image: url('https://jialianxin-1301053941.cos.ap-chengdu.myqcloud.com/static/buy/03.png');
			background-size: 100vw 100vh;
			padding-top: 700rpx;

			.box {
				height: 60vh;
				width: 90vw;
				position: relative;
				top: -250rpx;
				background-image: url('https://jialianxin-1301053941.cos.ap-chengdu.myqcloud.com/static/buy/04.png');
				background-size: 90vw 105vh;
				z-index: 10;
				margin-left: 5vw;
				border-radius: 30rpx;
				text-align: center;

				.curimg {
					display: inline-block;
					height: 50vh;
					margin-top: 5vh;
				}

				.but {
					background-image: url('https://jialianxin-1301053941.cos.ap-chengdu.myqcloud.com/static/buy/05.png');
					background-size: 100% 100%;
					width: 400rpx;
					height: 140rpx;
					font-size: 1.6em;
					color: white;
					background-color: rgba(255, 255, 255, 0);
				}

				.but:after {
					border: none;
				}
			}
		}
	}
</style>
